<template>
	<view class="content">
    <view v-for="(audio, index) in list" :key="index">
      <gurudin-audio
          :src="audio.src"
          :poster="audio.poster"
          :name="audio.name"
          :author="audio.author"
          :call="playCall"
          :theme="(index%2)==0 ? 'light' : 'dark'"
          ref="audioPlayers"
        ></gurudin-audio>
      <view :style="{height: '100rpx'}"></view>
    </view>

	</view>
</template>

<script>
  let vm = null

	export default {
		data() {
			return {
        list: [
          {
            src: 'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-9ad4a006-8944-4fce-ad91-09717a378f21/0dce2788-1940-4c72-b1de-d6f991185d42.mp3',
            poster: '../../pagesfind/static/music/晴天.png',
            name: '晴天',
            author: '周杰伦'
          },
          {
            src: 'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-9ad4a006-8944-4fce-ad91-09717a378f21/a398097b-6c85-41ec-b91e-0bb6e544a5c7.mp3',
            poster: '../../pagesfind/static/music/成都.png',
            name: '成都',
            author: '赵雷'
          },
		  {
		    src: 'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-9ad4a006-8944-4fce-ad91-09717a378f21/6719f96e-9040-4411-8747-8445c3ae1f36.mp3',
		    poster: '../../pagesfind/static/music/告白气球.png',
		    name: '告白气球',
		    author: '周杰伦'
		  },
		  {
		    src: 'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-9ad4a006-8944-4fce-ad91-09717a378f21/76022c28-69c6-486c-914d-a67e74466cef.mp3',
		    poster: '../../pagesfind/static/music/unstoppable.png',
		    name: 'Unstoppable',
		    author: 'Sia'
		  },
		  {
		    src: 'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-9ad4a006-8944-4fce-ad91-09717a378f21/18e6c554-5ba6-4c08-9c48-521ce7931f38.mp3',
		    poster: '../../pagesfind/static/music/阴天快乐.png',
		    name: '阴天快乐',
		    author: '陈奕迅'
		  },
		  {
		    src: 'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-9ad4a006-8944-4fce-ad91-09717a378f21/7d460894-bd59-43ff-aa89-1e9377d00eb5.mp3',
		    poster: '../../pagesfind/static/music/A thousands years.png',
		    name: 'A Thousand Years',
		    author: 'Christina Perri'
		  },
		  {
		    src: 'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-9ad4a006-8944-4fce-ad91-09717a378f21/972c740a-6c52-40bf-9a39-d086cc0461d0.mp3',
		    poster: '../../pagesfind/static/music/Because of you.png',
		    name: 'Because of you',
		    author: 'Kelly Clarkson'
		  },
		  {
		    src: 'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-9ad4a006-8944-4fce-ad91-09717a378f21/32217208-2fe0-4e62-9ed4-f79ea3de1aa1.mp3',
		    poster: '../../pagesfind/static/music/faded.png',
		    name: 'Faded',
		    author: 'Alan Walker'
		  },
        ],
			}
		},
		
		methods: {
      /**
       * 点击播放回调方法
       */
      playCall(src) {
        vm.$refs.audioPlayers.forEach(e =>{
          if (src != e.src) {
            e.onPause();
          }
        });
      },
		},

    created() {
      vm = this;
    }
	}
</script>

<style>
  page {
    /* background-color: #202124; */
    padding: 100rpx 0;
  }
  
  .content {
	  padding: 0 30rpx;
  }
</style>